<template>
  <div>
    <search></search>
    <div class="mian" style="width: 100%; text-align: center">
      ————————<span style="font-size: 16px; font-weight: 600; line-height: 40px"
        >为您推荐</span
      >————————
    </div>
    <van-pull-refresh v-model="loading" @refresh="onRefresh">
      <van-grid :border="false" :column-num="2">
        <van-grid-item v-for="(v, i) in list" :key="i">
          <van-image
            :src="
              v.goods_small_logo
                ? v.goods_small_logo
                : 'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg'
            "
            @click="ondetail(v.goods_id)"
          />
          <div>{{ v.goods_name }}</div>
        </van-grid-item>
      </van-grid>
    </van-pull-refresh>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { searchApi } from "@/api/api";
import search from "@/components/search.vue";
import { useRoute, useRouter } from "vue-router";
import { showToast } from "vant";

const router = useRouter();
const route = useRoute();

const list = ref([]);
const searchFun = () => {
  searchApi().then((res) => {
    list.value = res.data.message.goods;
  });
};
searchFun();
const count = ref(0);
const loading = ref(false);
const onRefresh = () => {
  setTimeout(() => {
    showToast("刷新成功");
    loading.value = false;
    count.value++;
  }, 1000);
};
const ondetail = (goods_id) => {
  router.push({ path: "/detail", query: { goods_id: goods_id } });
};
</script>

<style lang="scss" scoped></style>
